✅ Checklist

• 🧪 The component is unit tested
• 🧪 The component includes E2E tests
• 🗑️ Old Cypress tests exclusive to the component are removed (none existed)
• 📖 The component is documented in storybook with an .mdx file
• ♿ The component complies with the Web Content Accessibility Guidelines.
• 🌐 All strings intended for humans or assistive technology must be localized with i18n.
• 📦 The Lit component is exported in the appropriate index.ts and lazy-index.ts files.
• 🎨 CSS parts are documented still accessible.
• 🦥 Slotted Content, public methods and properties are documented
• 🔄 The component outputs the same Angular output as before with Stencil
• 🏷️ The component declares the component type in the HTMLElementTagNameMap

https://coveord.atlassian.net/browse/KIT-5050

Description

Migrates atomic-result-children from Stencil to Lit, preserving all functionality for displaying child results with template inheritance support.

Key Changes

New Reactive Controller

• Created FoldedItemListContextController to manage folded result list state via custom events and subscriptions
• Mirrors pattern established by other context controllers (ItemContextController, ChildTemplatesContextController)

Component Migration

• Converted Stencil @Component → Lit @customElement with proper decorators
• Replaced Stencil context decorators with Lit reactive controllers:
  • @ResultContext → createResultContextController
  • @FoldedItemListContext → FoldedItemListContextController
  • @ItemDisplayConfigContext → ItemDisplayConfigContextController
  • @ChildTemplatesContext → ChildTemplatesContextController
• Migrated lifecycle: componentWillRender → willUpdate, event listeners in connectedCallback/disconnectedCallback
• All imports converted to @/* path aliases

Functional Components

• Leverages existing Lit functional components:
  • renderResultChildrenGuard
  • renderChildrenWrapper
  • renderCollectionGuard
  • renderShowHideButton

Remaining Work

• E2E tests (generated boilerplate exists)
• Storybook stories with MSW mocking
• MDX documentation
• Export updates in index files
• Full build verification

Testing

Unit tests cover prop validation, error handling for missing templates, and template inheritance behavior.

Custom agent used: stencil-to-lit-migration-agent
Specialized agent for migrating Atomic Stencil code to Lit (components, functional components, and utils)

• Fixes Migrate atomic-result-children #6356

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.